Displaying Lists Inline with Image Seperators?

[Desigan Chinniah]

I am presently trying to display a list of items INLINE using an image as a
seperator..... and having difficulties....

See below for 3 seperate sets of html and css files. Each set does something
different. Ideally I would like the result of Menu 1 but instead of having
the pipe effect border on the right of each choice I would like to replace
that with an image of some sort.

Any help much appreciated.

------

Menu 1 (this has a pipe effect seperator that is controlled by a border
property) - This is how I would like to have it display but with an image as
a seperator

[html]
<ul class="menu1">
<li class="first">Option 1</li>
<li>Option 2</li>
<li>Option 3</li>
</ul>

[css]
ul.menu1 {
margin-left: 0px;
display: inline;
}

ul.menu1 li {
padding-right:3px;
padding-left:5px;
border-left: 1px solid #666666;
display: inline;
}
ul.menu1 li.first{
border-left: none;
display: inline;
}

-------------------

Menu 2 (this displays the list with images but they are not INLINE)

[html]
<ul class="menu2">
<li class="first">Option 1</li>
<li>Option 2</li>
<li>Option 3</li>
</ul>

[css]
ul.menu2 {
margin-left: 0px;
}

ul.menu2 li {
padding-right:3px;
padding-left:5px;
list-style-type: none;
list-style-image: url(bullet.gif);
list-style-position: inside;

}
ul.menu2 li.first {
list-style-image: none;
}
-------------------
Menu 3 (this displays the list INLINE but does not display the image)

[html]
<ul class="menu3">
<li class="first">Option 1</li>
<li>Option 2</li>
<li>Option 3</li>
</ul>
[css]
ul.menu3 {
margin-left: 0px;
}

ul.menu3 li {
padding-right:3px;
padding-left:5px;
list-style-type: none;
list-style-image: url(bullet.gif);
list-style-position: inside;
display: inline;
}
ul.menu3 li.first {
list-style-image: none;
}
ul.menu2 li.first {
list-style-image: none;
}
-------------------

Desigan Chinniah
ch******@cyberdees.net

[Jim Dabell]

Desigan Chinniah wrote:

I am presently trying to display a list of items INLINE using an image as
a seperator..... and having difficulties....

[snip]

Use a background image and sufficient padding on one of the sides.
--
Jim Dabell